/* eslint-disable no-unused-expressions */
/* eslint-disable no-labels */
/* eslint-disable no-labels */
<template>
  <div id="app">
    <!-- <span class="iconfont icon-zanting"></span> -->
    <img src="./assets/pase.png" class="pase" @click="pase" :style={display:flag}>
    <router-view @show-pase="showPase"></router-view>
    <play/>
  </div>
</template>
<script>
import play from './components/play.vue'
import start from './components/start.vue'
import down from './components/down.vue'
export default {
  data: () => {
    // eslint-disable-next-line no-labels
    return {
      flag: 'block'
    }
  },
  components: {
    // eslint-disable-next-line vue/no-unused-components
    play,
    // eslint-disable-next-line vue/no-unused-components
    start,
    // eslint-disable-next-line vue/no-unused-components
    down
  },
  methods: {
    pase () {
      this.flag = 'none'
      this.$router.replace('/')
      const backlen = window.history.length - 2
      window.history.go(-backlen)
      this.$router.replace('/', () => {
        window.location.reload()
      })
    },
    showPase () {
      this.flag = 'block'
    }
  }
}
</script>
<style >
#app {
  /* border: 1px solid red; */
}
.pase {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 50px;
  height: 50px;
}
</style>
